<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="layui/layui.js"></script>
    <style>
        .layui-nav-img {
            width: 60px;
            height: 60px;
            margin-right: 10px;
            border-radius: 50%;
        }
    </style>
</head>
<body>
<h1>主界面</h1>
<img id="pic" src="" class="layui-nav-img" >
<span id="user"></span>



<script>
    layui.use(function(){
        let $ = layui.jquery ;

        // 1.从 sessionStorage 中获取登录用户信息
        let userStr = sessionStorage.getItem("userinfo")
        let user = JSON.parse(userStr)

        //console.log(user)

        // 2.DOM操作  显示用户名和头像
        $("#user").text('用户：'+user.userName)
        $("#pic").prop("src",'images/' + user.avatar) ;
    }) ;

</script>

</body>
</html>